﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AnagraficaArticoli_CRUD.aspx.cs" Inherits="FimetContoDeposito.Anagrafiche.AnagraficaArticoli_CRUD" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <asp:PlaceHolder ID="PlaceHolder1" runat="server"> 
        <%: Scripts.Render("~/bundles/JQuery") %>          
        <%: Scripts.Render("~/bundles/JQueryUI") %>                
        <%: Styles.Render("~/bundles/Formly/css") %>
        <%: Scripts.Render("~/bundles/Formly") %>
    </asp:PlaceHolder>
          
    <link type="text/css" rel="stylesheet" href="../Styles/GrayParrot.Formly.css" />

    <script type="text/javascript" lang="javascript" src="../Scripts/Formly/FormlyHelper.js"></script>
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.Core.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.AngularJS.Directives.Fileupload.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.AngularJS.Directives.DateTimePicker.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.AngularJS.js"></script> 

    <title>Anagrafica Articoli</title>
</head>

<body ng-app="formlyExample" ng-controller="MainCtrl as vm" id="divFormly" name="divFormly">

    <%--<h1>Anagrafica Articoli<br /><hr /></h1>--%>
    <table>
        <tr>
            <td style="vertical-align:top; width:70%" >
                <div ng-if="vm.loadingData.$$state.status === 0" style="margin:20px 0;font-size:2em">
                    <strong>Loading...</strong>
                </div>
                <div ng-if="vm.loadingData.$$status.state !== 0">
                    <form ng-submit="vm.onSubmit()" novalidate id="formlyForm">
                        <formly-form model="vm.model" fields="vm.fields" form="vm.form">
                        <button type="sumbit" class="btn btn-primary submit-button" ng-disabled="vm.form.$invalid">Salva</button>
                        </formly-form>
                    </form>
                </div>
            </td>
            <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
            <td style="vertical-align:top">
                <div>
                    <img id="img2" class="img-thumbnail" src="http://placehold.it/350x150/7ba9d0/fff?text=immagine+articolo+%3A%29" style='width:100%;max-width:350px;max-height:250px' />
                    <button type="button" class="btn" onclick="CancellaFoto()">Cancella Foto</button>
                </div>

            </td>
        </tr>
    </table>


</body>

   <script>
       //$(document).ready(function () {

       //    $("#imgArticolo").change(function () {
       //        readURL(this);
       //    });

       //});

       var idMagazzino = GetQueryStringParams("idMg");
       var codXXXX = GetQueryStringParams("codXXXX");
       var idToEdit = GetQueryStringParams("id");

       var settings = new FormlySettings();
       settings.container = '#divFormly';
       settings.callbackSuccess = SuccessCallback;
       settings.onloadCallback = LoadCallback;

       if (codXXXX !== undefined) {
           settings.setLoad(settings.createGetConfig('/api/AnagraficaArticoli/LoadFieldsCodXXXX', { idMagazzino: idMagazzino, codiceXXXX: codXXXX }));
           settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/Upload'));
       } else {

           if (idToEdit == undefined) {
               settings.setLoad(settings.createGetConfig('/api/AnagraficaArticoli/LoadFieldsEx', { idMagazzino: idMagazzino }));
               //settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/Add'));
               settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/Upload'));
           } else {
               settings.setLoad(settings.createGetConfig('/api/AnagraficaArticoli/LoadFieldsEx', { id: idToEdit, idMagazzino: idMagazzino }));
               //settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/Edit'));
               settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/UploadEdit'));
           }
       }

       FormlyManager(settings);

       //
       function CancellaFornitore() {
           var scope = extScope;

           var m_fornitore = extScope.vm.model.Fornitore;

           extScope.vm.model.Fornitore = null;
       }

       function TrovaArticolo(options, scope) {
           var model = extScope.vm.model;

           var url = "/api/AnagraficaArticoli/GetArticoloByCodiceFornitore";

           $.ajax({
               global: false,
               type: "POST",
               url: url,
               data: JSON.stringify({ id: options }),
               contentType: "application/json; charset=utf-8",
               dataType: "json",
               success: function (response) {
                   var model = extScope.vm.model;

                   if ((response != null) && (response !== undefined)) {
                       model.Articolo = response;

                       extScope.vm.form.formly_1_asyncselect_Articolo_0.$viewValue = response;
                       extScope.vm.form.formly_1_asyncselect_Articolo_0.$render();
                       //var id = 'string:' + response;
                       //$('#formly_1_asyncselect_Articolo_0').val(id);
                       $("#formly_1_asyncselect_Articolo_0").trigger("change");
                   }

                   extScope.$apply();
               },
               failure: function (response) {
                   alert(response);
               }
           });
       }

       function CancellaFoto() {
           $('#img2').attr('src', 'http://placehold.it/350x150/7ba9d0/fff?text=immagine+articolo+%3A%29');
       }

       function ShowImg(options, scope) {
           //var inputf = $('#FotoArticolo');
           var inputf2 = $('#Foto').context.activeElement;

           readURL(inputf2);
       }

       function readURL(input) {
           if (input.files && input.files[0]) {
               var reader = new FileReader();

               reader.onload = function (e) {
                   $('#img2').attr('src', e.target.result);
               }

               reader.readAsDataURL(input.files[0]);
           }
       }

       function LoadCallback() {
           var scope = extScope;

           var m_foto = extScope.vm.model.FotoArticolo;

           $('#img2').attr('src', m_foto);
       }

       function SuccessCallback(response) {
           window.parent.CloseDialog(response);
       }
   </script>

</html>
